src/index.ts (2)

172-179: Outdated deprecation note contradicts the current non-standalone status

The comment states the component is standalone, but the decorator no longer sets standalone: true and a module is provided. This will confuse users.

-/**
- * @deprecated This module is deprecated. Import `InteractiveVideoComponent` directly as it is a standalone component.
- * A module for the InteractiveVideoComponent for non-standalone usage.
- */
+/**
+ * Angular module for using InteractiveVideoComponent in NgModule-based apps.
+ * The component is non-standalone; import this module where needed.
+ */

---

1-14: Update TestBed to Import InteractiveVideoModule, Not the Component

Tests in test/interactive-video.test.ts currently do this:

• import { InteractiveVideoComponent } from '../src';
• TestBed.configureTestingModule({ imports: [InteractiveVideoComponent] })

After moving the component into InteractiveVideoModule, you must:

• Change the import to bring in the module
• Update the TestBed setup to import InteractiveVideoModule instead of the standalone component

Example diff:

--- test/interactive-video.test.ts
+++ test/interactive-video.test.ts
@@ 1,5
-import { InteractiveVideoComponent } from '../src';
+import { InteractiveVideoModule } from '../src';

 beforeEach(async () => {
-  await TestBed.configureTestingModule({
-    imports: [InteractiveVideoComponent],
-  }).compileComponents();
+  await TestBed.configureTestingModule({
+    imports: [InteractiveVideoModule],
+  }).compileComponents();
 });

This ensures the test harness has the necessary declarations/providers bundled in the module.

examples/.gitignore (1)

1-1: Consider ignoring build artifacts for the example as well.

Ignoring only .angular is fine, but it's typical to also ignore node_modules and dist in the example to prevent accidental commits of built assets.

Apply this diff:

-.angular
+.angular
+node_modules
+dist

tsup.config.ts (1)

16-25: Banner may render “[object Object]” for author and can break if fields contain “*/”.

If package.json#author is an object (common in many repos), ${pkg.author} will stringify as [object Object]. Also, unescaped */ in metadata could terminate the comment. Minor, but worth hardening.

Suggested change within this block:

- * @author ${pkg.author}
+ * @author ${authorName}

Add this helper above the export (outside the selected range):

// Normalize author to a string and escape comment terminators used in the banner.
const rawAuthor =
  typeof pkg.author === 'string' ? pkg.author : pkg.author?.name ?? '';
const authorName = rawAuthor.replace(/\*\//g, '*\\/');

Optionally, escape other interpolated fields similarly if they could be dynamic:

• pkg.description
• pkg.name
• pkg.version
• pkg.license

If you want, I can provide a small escapeForJsBlockComment(str) helper and apply it across the interpolations.

pnpm-workspace.yaml (1)

1-3: Workspace setup looks good; consider future-proofing examples glob.

Current config is correct. If you plan to add multiple examples, using a glob can reduce future edits.

Optional tweak:

 packages:
   - '.'
-  - 'examples'
+  - 'examples'
+  # or, if you plan multiple examples:
+  # - 'examples/*'

examples/tsconfig.json (2)

17-21: Align module resolution with Angular 19 defaults to avoid type/loader mismatches

Angular 19 tooling favors "bundler" module resolution. Keeping "node" can surface subtle resolution issues (e.g., ESM/CJS interop, type-only imports) in CLI builds.

Apply:

-    "moduleResolution": "node",
+    "moduleResolution": "bundler",

---

22-26: Double-check the path alias isn’t fighting the workspace dependency

You have both a workspace dependency on @interactive-video-labs/angular (in examples/package.json) and a TS paths alias to ../dist here. If dist is missing or stale, this mapping can break example builds unexpectedly.

If the intention is to consume the workspace package directly, consider removing the paths entry or gate it behind a local-dev tsconfig override. Do you want me to generate a dev-only tsconfig override pattern?

package.json (2)

21-21: Nit: remove extra whitespace in dev script

Tiny cleanup.

-    "dev": "tsup  --watch",
+    "dev": "tsup --watch",

---

33-34: Remove empty keyword entry

Empty string in keywords is unnecessary and shows up oddly on registries.

   "keywords": [
     "interactive-video",
     "angular",
     "angular-component",
     "typescript",
     "video-player",
-    "cue-points",
-    ""
+    "cue-points"
   ],

examples/app.component.ts (1)

29-33: Strongly type the analytics event handler

Use the exported tuple types to tighten the example and guide consumers.

-export class AppComponent {
-  onAnalyticsEvent(event: any) {
-    console.log('Analytics Event:', event);
-  }
-}
+import type { AnalyticsEvent, AnalyticsPayload } from '@interactive-video-labs/angular';
+
+export class AppComponent {
+  onAnalyticsEvent([event, payload]: [AnalyticsEvent, AnalyticsPayload?]) {
+    console.log('Analytics Event:', event, payload);
+  }
+}

examples/package.json (1)

4-10: Ensure the library is built before serving the example

Since the example depends on the workspace package whose exports point to dist, serving before building the library can fail. Add a prestart hook to build the library first.

   "scripts": {
     "ng": "ng",
+    "prestart": "pnpm --filter @interactive-video-labs/angular build",
     "start": "pnpm exec ng serve --configuration=development --verbose",
     "build": "ng build",
     "watch": "ng build --watch --configuration development",
     "test": "ng test"
   },

src/index.ts (1)

125-130: SSR-safety: prefer injecting DOCUMENT instead of direct document access

Direct document.getElementById breaks in server-side rendering. Inject DOCUMENT from @angular/common for optional SSR compatibility.

I can provide a patch to add DOCUMENT injection and guard access if needed.

examples/app.module.ts (1)

6-12: This NgModule is unused with the current standalone bootstrap; consider removing or documenting as an alternative

tsconfig.app.json compiles only main.ts and its transitive imports, so this file is currently dead code. If the example intends to demonstrate the module-based approach, either:

• Replace bootstrapApplication with AppModule bootstrap in main.ts, or
• Keep this file but add a short comment to indicate it’s an alternative wiring for non-standalone use.

examples/main.ts (1)

4-4: Ensure AppComponent is standalone (and imports the library module) or switch to AppModule bootstrap

If AppComponent is standalone, it should declare imports: [InteractiveVideoModule] (or importProvidersFrom in bootstrap). If it’s not standalone, bootstrap the AppModule instead.

Two viable options:

• Option A (stay standalone; preferred): In AppComponent, add imports: [InteractiveVideoModule]. No change needed here.

• Option B (module-based bootstrap): apply this change to use AppModule.

-import { bootstrapApplication } from '@angular/platform-browser';
-import { AppComponent } from './app.component';
-
-bootstrapApplication(AppComponent).catch((err) => console.error(err));
+import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
+import { AppModule } from './app.module';
+
+platformBrowserDynamic()
+  .bootstrapModule(AppModule)
+  .catch((err) => console.error(err));

examples/index.html (1)

4-9: Consider adding a base href for better routing and asset resolution

While optional for this simple demo, Angular apps typically include <base href="/"> to ensure correct relative URL resolution (routing, assets) when deployed under varying paths.

   <head>
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <base href="/" />
     <title>Simple Example</title>
   </head>

examples/angular.json (2)

10-10: sourceRoot points to “src” but sources live at project root

index.html and main.ts are at the project root per your options. Consider aligning sourceRoot to "" to avoid confusion with tooling/generators.

-      "sourceRoot": "src",
+      "sourceRoot": "",

---

73-82: Test configuration references tsconfig.spec.json which is not present

If you plan to run tests for the example, add tsconfig.spec.json (and a basic test setup). Otherwise, it’s fine, but running ng test in examples will fail.

Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro

💡 Knowledge Base configuration:

• MCP integration is disabled by default for public repositories
• Jira integration is disabled by default for public repositories
• Linear integration is disabled by default for public repositories

You can enable these sources in your CodeRabbit configuration.